{{ 'section-multicolumn.css' | asset_url | stylesheet_tag }}
<link rel="stylesheet" href="{{ 'component-slider.css' | asset_url }}" media="print" onload="this.media='all'">
{{ 'spec-multicolumn5.css' | asset_url | stylesheet_tag }}

<div class="spec_multicolumn cgo_spec powerbank_spec_for_five">
  <div class="multicolumn background-{{ section.settings.background_style }}{% if section.settings.title == blank %} no-heading{% endif %}">
    <div class="page-width">
      <details open>
        <summary>
          <div class="title-wrapper-with-link title-wrapper--self-padded-mobile{% if section.settings.title == blank %} title-wrapper-with-link--no-heading{% endif %}">
            <h2 class="title">
              {{ section.settings.title | escape }}
            </h2>
          </div>
          <div class="ten-summary">
            {% render 'icon-qjia' %}
            {% render 'icon-qjian' %}
            </div>
        </summary>
        <ul class="row-list specification-five-row-list">
          {%- for block in section.blocks -%}
          <li class="row-list__item row__item">
            <div class="label-text">{{ block.settings.text }}</div>
          </li>
          {%- endfor -%}
        </ul>
      </details>
    </div>
  </div>
</div>

{% schema %}
{
  "name": "Specification-five",
  "class": "spaced-section spaced-section--full-width specification-five",
  "tag": "section",
  "settings": [
    {
      "type": "text",
      "id": "title",
      "default": "Multicolumn",
      "label": "t:sections.multicolumn.settings.title.label"
    }
  ],
  "blocks": [
    {
      "type": "Lable",
      "name": "Item Text",
      "settings": [
        {
          "type": "richtext",
          "id": "text",
          "label": "Item Text"
        }
      ]
    }
  ],
  "presets": [
    {
      "name": "Specification-five",
      "blocks": [
        {
          "type": "Lable"
        },
        {
          "type": "Lable"
        }
      ]
    }
  ]
}
{% endschema %}
